<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="../common.css" type="text/css">
    <style>
       #supply {
            width: 100vw;
            height: 100vh;
        }

        .back {
            width: 50vw;
            height: 90vh;
            padding: 5vh 25vw 5vh 25vw;
            background-color: #f8e27d;
            text-align: center;
        }
        .supply_title p{
            font-size: 3vw;
            color: #53493f;
        }
        .supply_image{
            margin-top: 2vw;
        }
        .supply_image>div{
            width: 100%;
            height: 50vh;
            background-color: red;
        }
        .supply_icon{
            margin-top: 2vw;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        .supply_icon>div{
            width: 6vw;
            padding: 1vw;
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        .supply_icon>div img{
            width: 5vw;
        }
        .supply_icon>div p{
            font-size: 1vw;
            line-height: 1.4vw;
            font-weight: 600;
        }
        .supply_btn{
            margin-top: 4vh;
        }
        .supply_btn a{
            font-size: 1vw;
            padding: 0.8vw 4.5vw;
            color: white;
            box-shadow: -3px 5px 10px #fedb2b85;
            background-image: linear-gradient(to right,#fb3e74 ,#fede2b );
            border-radius: 2vw;
        }
        </style>
</head>

<body>
    <div id="supply">
        <div class="back">
            <div class="supply_title">
                <p>萌岛供应链</p>
            </div>
            <div class="supply_image">
                <div></div>
            </div>
            <div class="supply_icon">
                <div class="supply_icon_ip">
                   <img src='../img/icon14.png' alt="">
                    <p>正版IP</p>
                    <p>品质保障</p>
                </div>
                <div class="supply_icon_sku">
                        <img src='../img/icon13.png' alt="">
                    <p>3000+IP积累</p>
                    <p>SKU保障</p>
                </div>
                <div class="supply_icon_stock">
                        <img src='../img/icon12.png' alt="">
                    <p>自有仓库</p>
                    <p>库存保障</p>
                </div>
                <div class="supply_icon_factory">
                        <img src='../img/icon15.png' alt="">
                    <p>成熟工厂合作</p>
                    <p>质量产能保障</p>
                </div>
            </div>
            <div class="supply_btn">
                    <a>娃娃实体浏览</a>
                </div>
        </div>
    </div>
</body>

</html>